<template>
    <div>
        <el-collapse v-model="activeNames">
            <el-collapse-item title="AO查询" name="1">
                <!--AO查询表单-->
                <el-form :inline="true" :model="formInline" class="demo-form-inline">
                    <el-form-item label="工作包号">
                        <el-input v-model="formInline.workpageCode"  size="mini" placeholder="工作包号"></el-input>
                    </el-form-item>
                    <el-form-item label="AO号">
                        <el-input v-model="formInline.aoCode"  size="mini" placeholder="AO号"></el-input>
                    </el-form-item>
                    <el-form-item label="架次">
                        <el-input v-model="formInline.planeNo"  size="mini" placeholder="架次"></el-input>
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary"  size="mini" @click="doQuery">查询</el-button>
                        <el-button type="primary" size="mini" @click="doReset">重置</el-button>
                        <el-button type="primary" size="mini" @click="exeTask">执行任务</el-button>
                        <el-button type="primary" size="mini"  @click="lookupHcx">查看缓存箱</el-button>
                        <el-button type="primary" size="mini"  @click="clickAddHcxViewBtn">补叫缓存箱</el-button>
                        <el-button type="primary" size="mini"  @click="aoTopMatch">AO预配套</el-button>
                        <el-button size="mini" type="success" @click="refresh">刷新</el-button>
                    </el-form-item>
                </el-form>
                <!--表格信息-->
                <el-table :data="tableData" height="200" @selection-change="handleSelectionChange">
                    <el-table-column type="selection" width="55"></el-table-column>
                    <el-table-column type="index" width="55"></el-table-column>
                    <el-table-column prop="stateName" label="配套情况"></el-table-column>
                    <el-table-column prop="aStateName" label="缺配情况"></el-table-column>
                    <el-table-column prop="packageCode" label="工作包" width="180"></el-table-column>
                    <el-table-column prop="packageName" label="工作包名称" width="180"></el-table-column>
                    <el-table-column prop="aoCode" label="AO编号" width="180"></el-table-column>
                    <el-table-column prop="aoName" label="AO名称" width="180"></el-table-column>
                    <el-table-column prop="productCode" label="机型" width="180"></el-table-column>
                    <el-table-column prop="batchNo" label="批次"></el-table-column>
                    <el-table-column prop="startPlaneNo" label="架次"></el-table-column>
                    <el-table-column prop="planStarDate" label="计划开工时间" width="180"></el-table-column>
                    <el-table-column prop="weekTime" label="周计划时间" width="180"></el-table-column>
                    <el-table-column prop="dailyTime" label="日计划时间" width="180"></el-table-column>
                    <el-table-column prop="sortingStatus" label="分拣状态" width="180"></el-table-column>
                    <el-table-column prop="consoleName" label="分拣台" width="180"></el-table-column>
                </el-table>
                <!--分页参数-->
                <el-pagination @size-change="handleSizeChange"  @current-change="handleCurrentChange" :current-page="page.currentPage" 
                        :page-sizes="[10,50,100, 200, 300, 400]" :page-size="page.pageSize" layout="total, sizes, prev, pager, next" :total="page.total">
                </el-pagination>
                <!--查看缓存箱子抽屉-->
                <div>
                    <el-drawer
                        title="缓存箱列表"
                        size="75%"
                        :visible.sync="drawer.drawer"
                        :with-header="false">
                        <el-table :data="drawer.tableData" style="width: 100%" row-key="id" height=600  highlight-current-row  @current-change="currentTableData">
                            <el-table-column  prop="workbinCode" label="缓存箱名字" width="150"> </el-table-column>
                            <el-table-column prop="workbinStatus" label="状态" width="130"> </el-table-column>
                            <el-table-column prop="taskType" label="需手动处理" width="130"> </el-table-column>
                            <el-table-column prop="roadway" label="巷道" width="120"> </el-table-column>
                            <el-table-column prop="taskCnt" label="当前巷道排队任务数" width="120"> </el-table-column>
                            <el-table-column prop="waitMin" label="预计等待时长(分钟)" width="120"> </el-table-column>
                            <el-table-column prop="itemCode" label="图号"></el-table-column>
                            <el-table-column prop="itemQty" label="待入数量"></el-table-column>
                            <el-table-column prop="aoCode" label="配套AO" show-overflow-tooltip></el-table-column>
                            <el-table-column prop="mProductNumber" label="型号"></el-table-column>
                            <el-table-column prop="createTime" label="创建时间" width="150" ></el-table-column>
                            <el-table-column prop="orderTime" label="下发时间" width="150" ></el-table-column>
                            <el-table-column prop="parentTaskId" label="移库中" width="150" ></el-table-column>
                            <el-table-column label="操作">
                            <template slot-scope="scope">
                            <el-button  size="mini" v-if="scope.row.taskType=='未创建任务'" @click="handleEdit(scope.$index, scope.row)">创建任务</el-button>
                            </template>
                            </el-table-column>
                        </el-table>
                    </el-drawer>
                </div>
                <!--补叫箱子抽屉-->
                <div>
                    <el-drawer title="补叫缓存箱" size="75%" :visible.sync="hcxDrawer.drawer" :direction="hcxDrawer.direction" :before-close="handleClose">
                        <el-row>
                            <el-col :span="6">
                                <slot>工作包信息</slot>
                                <el-tree :data="hcxDrawer.treeData" :props="hcxDrawer.defaultProps" @node-click="handleNodeClick"></el-tree>
                            </el-col>
                            <el-col :span="18">
                                <slot>补叫箱子列表</slot>
                                <div>
                                    <el-button class="btn-width" size="mini" type="primary" @click="addEmptyToolTask" >补叫空托盘</el-button>
                                    <el-button class="btn-width" size="mini" type="primary" @click="addWorkbinTask" >缓存箱出库</el-button>
                                </div>
                                <el-table  ref="receiveTable" size="mini" border :data="table.resData"  height="550"  @selection-change="handleSelectionChangeSingle">
                                    <el-table-column type="selection" width="50"></el-table-column>
                                    <el-table-column type="index" label="序号" width="50" :show-overflow-tooltip="true"> </el-table-column>
                                    <el-table-column prop="workbinCode" sortable label="箱子号" width="100"  :show-overflow-tooltip="true"> </el-table-column>
                                    <el-table-column prop="itemQty" sortable label="数量" width="100"  :show-overflow-tooltip="true"> </el-table-column>
                                    <el-table-column prop="itemCode" sortable label="图号" width="160"  :show-overflow-tooltip="true"> </el-table-column>
                                    <el-table-column prop="qualityCode" sortable label="质量编号" width="150" :show-overflow-tooltip="true"> </el-table-column>
                                    <el-table-column prop="itemName" sortable label="图号名称" width="150" :show-overflow-tooltip="true" > </el-table-column>
                                    <el-table-column prop="itemType" sortable label="物料类型" width="150" :show-overflow-tooltip="true"> </el-table-column>
                                    <el-table-column prop="roadway" sortable label="巷道" :show-overflow-tooltip="true"> </el-table-column>
                                </el-table>
                                <!-- 分页 -->
                                <el-pagination  @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="table.page.pageNumber" :page-sizes="[10,20,50,100]"
                                    :page-size="table.page.pageSize"
                                    layout="total, sizes, prev, pager, next, jumper"
                                    :total="table.page.totalCount">
                                </el-pagination>
                            </el-col>
                        </el-row>
                    </el-drawer>
                </div>
            </el-collapse-item>
        </el-collapse>
    </div>
</template>
<script>
import request from "@/utils/request.js";
export default {
    inject:['reload'],
    data(){
        return{
            activeNames:['1'],
            formInline:{workpageCode:"",aoCode:""},
            page:{currentPage:1, pageSize:10,total:0},
            tableData:[],
            selectAoData:[],
            drawer:{
                drawer:false,
                tableData:[],
                currentData:{}
            },
            hcxDrawer:{
                drawer: false,
                direction: 'rtl',
                defaultProps:{children: 'children',label: 'label'},
                treeData:[]
            },
            table:{
                multipleSelection:[],//复选框勾选的数据
                resData:[],//表格数据
                page:{//分页参数
                    pageSize:50,
                    totalCount:0,
                    pageNumber:0
                }
            }
        }
    },
    methods:{
        doQuery(){
            request.post("/PointPackageSortRest/searchPointAo",{"page":this.page,"queryParam":this.formInline}).then((res)=>{
                console.log("res",res);
                this.tableData = res.data.list;
                this.page.total = res.data.total
            });
        },
        doReset(){
            Object.assign(this.formInline,this.$options.data().formInline);
        },
        exeTask(){
            if(this.selectAoData.length!=1){
                this.$Alert({title: "失败",message:"请选择一条数据",type: "error"});
                return ;
            }
            request.post("/PointPackageSortRest/startAoSorting",{"msTaskAoId":this.selectAoData[0].msTaskAoId}).then((res)=>{
                console.log("ao exe",res);
                if(res.data.retCode=="200"){
                    this.$Alert({title: "成功",message:"操作成功",type: "success"});
                }else{
                    this.$Alert({title: "失败",message:res.data.message,type: "error"});
                }
            });
        },
        lookupHcx(){
            this.drawer.drawer = true;
            this.drawer.tableData = [];
            var that = this;
            request.post("/PointPackageSortRest/searchSortingTask",{}).then((res)=>{
                console.log("res1",res);
                that.drawer.tableData = res.data;
            })
        },
        clickAddHcxViewBtn(){
            console.log(this.selectAoData);
            if(this.selectAoData.length==0){
                this.$Alert({title: "失败", message: "请至少选择一条数据！",type: "error"});
                return;
            }
            this.hcxDrawer.drawer = true;
            request.post("/materialReceipt/queryGzbMaterialTree",this.selectAoData[0]).then((res)=>{
                var tree = [];
                tree.push(res.data);
                this.hcxDrawer.treeData = tree;
            });
        },
        refresh(){
            this.reload();
        },
        handleSelectionChange(val){
            this.selectAoData = val;
        },
        handleSizeChange(val){
            this.page.pageSize = val;
            this.$options.methods.doQuery.bind(this)();
        },
        handleCurrentChange(val){
            this.page.currentPage = val;
            this.$options.methods.doQuery.bind(this)();
        },
        addEmptyToolTask(){//补叫空托盘
            request.post("/materialReceipt/reCalToolTask",{}).then((res)=>{
                if(res.data.retCode=="200"){
                    this.$Alert({title: "成功", message: res.data.retMsg,type: "success"});
                }else{
                    this.$Alert({title: "失败", message: res.data.retMsg,type: "error"});
                } 
            });
        },
        addWorkbinTask(){
            if(this.table.multipleSelection.length==0){
                this.$Alert({title: "失败", message: "请至少选择一条数据！",type: "error"});
                return ;
            }
            request.post("/materialReceipt/reCallWorkbinTask",this.table.multipleSelection[0]).then((res)=>{
                if(res.data.retCode=="200"){
                    this.$Alert({title: "成功", message: res.data.retMsg,type: "success"});
                }else{
                    this.$Alert({title: "失败", message: res.data.retMsg,type: "error"});
                }
            });
        },
        handleNodeClick(data) {
            request.post("/materialReceipt/usableWorkbinQuery",{"searchParams":data,"pageParameter":this.table.page}).then((res)=>{
                this.table.resData = res.data.retData;
            });
        },
        handleClose(done){//关闭遮罩层
            done();
        },
        currentTableData(val){
            console.log("val",val);
            this.drawer.currentData = val;
        },
        handleSelectionChangeSingle(val) {
            if(val.length>1){
                this.$refs.receiveTable.clearSelection();
                var array = val.pop();
                this.$refs.receiveTable.toggleRowSelection(array);
                this.table.multipleSelection = array;
            }else{
                this.table.multipleSelection = val;
            }
        },
        aoTopMatch(){
            if(this.selectAoData.length!=1){
                this.$Alert({title: "失败", message: "请至少选择一条数据！",type: "error"});
                return ;
            }
            var map = {"i_ms_task_package_id":this.selectAoData[0].msTaskPackageId,"i_task_ao_id":this.selectAoData[0].msTaskAoId,"i_type":"ao"}
            request.post("/PointPackageSortRest/packageTopMatch",map).then((res)=>{
                if(res.data.retCode=="200"){
                    this.$Alert({title: "成功", message: res.data.message,type: "success"});
                }else{
                    this.$Alert({title: "失败", message: res.data.message,type: "error"});
                }
            });
        }
    }
}
</script>